<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>圣杯模式继承</title>
</head>
<body>
    <script>
        /**
        * 圣杯模式继承
        **/
        function Supper(){
            this.a = '111';
            this.b = [1, 2, 3, 4]
        }

        Supper.prototype = {
            say: function(){
                console.log('222');
            },
            c: '444'
        }

        // 中间件Buffer
        function Buffer(){}
        // 让中间件继承Supper.prototype(Supper原型)
        Buffer.prototype = Supper.prototype;
        // 实例化中间件
        var buffer = new Buffer();

        function Sub(){
            // 构造函数继承
            Supper.call(this)
        }

        // Sub原型继承buffer实例对象
        Sub.prototype = buffer;

        // 构造函数指向Sub
        Sub.prototype.constructor = Sub;
        // 父类原型
        Sub.prototype.uber = Supper.prototype;

        var sub1 = new Sub();
        console.log(sub1, 'sub1')
        sub1.a = '333';
        sub1.b.push(5)
        
        sub1.say(); // 222
        console.log(sub1.c); // 444

        var sub2 = new Sub();

        console.log(sub1.a); // 333
        console.log(sub2.a); // 111

        console.log(sub1.b); // [1, 2, 3, 4, 5]
        console.log(sub2.b); // [1, 2, 3, 4]
    </script>
</body>
</html>